input:focus,
textarea:focus,
select:focus,
div:focus {
	outline: none;
	list-style: none;
}

/* 清除浮动 */
.clearfloat::before,
.clearfloat::after {
	content: '';
	visibility: hidden;
	clear: both;
	display: block;
}

.fl {
	float: left;
}

.fr {
	float: right;
}

.container {
	max-width: 1200px;
	margin: 0 auto;
}

#online_box {
	position: fixed;
	z-index: 9999999999;
	width: 100%;
	height: 100%;
	background: radial-gradient(black, transparent);
	display: none;
	overflow-y: auto;
}

#online_box .container {
	width: 60%;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}

.wrapper_box {
	position: fixed;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	z-index: 9999999999;
	background: rgba(0, 0, 0, 0.5);
	display: none;
}

.popover {
	position: relative;
	margin: 0 auto;
	background: #fff;
	width: 400px;
	top: 40%;
}

.popover .dialog_header {
	padding: 20px 20px 10px;
	text-align: center;
	box-sizing: border-box;
}

.dialog_header button {
	position: absolute;
	top: 20px;
	right: 20px;
	padding: 0;
	background: transparent;
	border: none;
	outline: none;
	cursor: pointer;
	font-size: 20px;
	color: #909399;
	font-weight: 300;
}

.popover .dialog_title {
	line-height: 24px;
	font-size: 18px;
	color: #303133;
}

.popover .dialog_body {
	padding: 20px 25px;
	color: #606266;
	font-size: 14px;
	word-break: break-all;
}

.popover .dialog_footer {
	padding: 10px 20px 20px;
	text-align: right;
	box-sizing: border-box;
}

.popover .dialog_footer button {
	display: inline-block;
	line-height: 1;
	white-space: nowrap;
	cursor: pointer;
	background: #fff;
	border: 1px solid #dcdfe6;
	color: #606266;
	-webkit-appearance: none;
	text-align: center;
	box-sizing: border-box;
	outline: none;
	margin: 0;
	transition: .1s;
	font-weight: 500;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	padding: 5px 20px;
	font-size: 14px;
	border-radius: 4px;
}

.popover .dialog_footer .button_primary {
	color: #fff;
	background-color: #409eff;
	border-color: #409eff;
}

.online_close {
	position: absolute;
	right: 30px;
	top: 0px;
	color: #fff;
	font-weight: 600;
	cursor: pointer;
}

.board-title {
	height: 48px;
	line-height: 48px;
	background-color: #ebb155;
	position: relative;
	text-align: center;
	margin: 20px 0 0;
}

.board-title h2 {
	color: #fff;
	font-size: 20px !important;
	font-weight: 700;
}

.online_service {
	margin-bottom: 20px;
}

.exchange_box {
	width: 100%;
	display: block;
	/* height:400px; */
	height: 450px;
	background-color: #F2F2F2;
	padding: 20px;
	box-sizing: border-box;
	overflow-y: auto;
	overflow-x: hidden;
}

.exchange_area {
	/* height:400px; */
	display: block;

}

.customer_Box {
	margin-bottom: 30px;
}

.customer_header span,
.customer_header lable {
	font-size: 14px;
	color: #999999;
}

.cont_box {
	display: inline-block;
}

.customer_con {
	/* width: 324px; */
	display: inline-block;
	background-color: #fff;
	border: none;
	border-radius: 5px;
	margin-top: 5px;
	margin-left: 10px;
	padding: 5px 10px;
	box-sizing: border-box;
	position: relative;
	box-shadow: 0px 17px 12px -12px #999;
}

.sendFail {
	position: absolute;
	color: red;
	font-weight: bold;
	left: -14px;
	top: 0;
}

.triangle {
	border-width: 20px 20px 0px 20px;
	;
	border-style: solid;
	border-color: transparent #fff transparent transparent;
	width: 0px;
	height: 0px;
	position: absolute;
	bottom: 0px;
	left: -35px;
	/* transform: rotate(-7deg); */
}

.customer_main {
	position: relative;
}

.customer_main p {
	font-size: 14px;
	color: #666666;
	text-align: justify;
	display: block;
	word-break: break-all;
}

.customer_main p img {
	width: 200px;
}

.business {
	width: 324px;
}

.customer_main .business li,
.customer_main .business li a {
	display: block;
	color: #3399FF;
	font-size: 14px;
	cursor: pointer;
}

.customer_main .business li:hover {
	text-decoration: underline !important;
}

.user_box {
	margin-right: 10px;
	text-align: right;
	display: block;
}

.user_box .triangle {
	right: -13px;
	left: auto;
	border-width: 20px 20px 20px 0px;
	border-color: transparent transparent #1d6d87 transparent;
}

.user_box .customer_con {
	background-color: #1d6d87;
	box-shadow: 1px 10px 12px -4px #999;
}

.user_box .customer_main p {
	color: #fff;
	text-align: justify;
	word-break: break-all;
}

.customer_Box .customer_main p img {
	margin: 10px 0 0;
	float: left;
}

/* .user_box .customer_main p object{
	font-size: 20px;
	width: 20px;
	background-repeat: no-repeat;
	background-size: 100% 100%;
} */
/* 系统提示 */

.tip_msg {
	/* margin-top: 30px; */
	text-align: center;
}

.tip_msg p {
	color: #999999;
	font-size: 14px;
}

/* 聊天区域css  end */
/* 输入框区域 start*/
.input_box_area {
	width: 100%;
	background-color: #fff;
	border: 1px solid #cccccc;
	padding: 10px;
	box-sizing: border-box;
	position: relative;
}

.tool_img {
	height: 18px;
	padding: 0px 6px 5px 0;
	outline: 0;
	cursor: default;
	border: 0;
	width: 30px;
	float: left;
}

.tool_img span {
	background: url(/eportal/uiFramework/commonResource/zip/onlineS/imgbtn.png) no-repeat;
	background-size: 16px;
	cursor: inherit;
	margin-top: 1px;
	width: 30px;
	height: 30px;
	display: inline-block;
}

.emote_dd {
	position: relative;
}

#emote {
	position: relative;
	top: -1px;
	width: 17px;
}

.emote_box {
	width: 350px;
	height: 150px;
	background-color: #fff;
	position: absolute;
	top: -160px;
	left: -18px;
	overflow-y: auto;
	box-shadow: -2px 3px 15px 2px #999;
	display: none;
}

.emote_ul {
	width: 100%;
}

.emote_ul li {
	float: left;
	display: inline-block;
	margin: 5px;
	width: 20px;
	background-repeat: no-repeat;
}

/* .emojiSvg{
	border: 0px;
	width: 24px;
	height: 24px;
	padding: 0px;
	vertical-align: middle;
} */
.Emoteimg {
	width: 30px !important;
	height: 30px !important;
}

.input_text_area {
	color: #000000;
	text-align: left;
	position: relative;
}

.input_text_area #text_area1 {
	width: 100%;
	border: 0;
	padding: 10px 0;
	/* height: 130px; */
	height: 87px;
	overflow: auto;
	font-size: 14px;
}

.t-icon {
	width: 20px !important;
	height: 20px !important;
	background-repeat: no-repeat !important;
	background-size: 100% 100% !important;
}

object {
	margin: 0 3px;
}

/* div显示占位符内容 */
[contentEditable=true]:empty:not(:focus):before {
	content: attr(data-text);
	color: #999999;
}

#text_area1 img {
	width: 60px;
	height: 60px;
	display: inline-block;
	margin: 0 5px;
}

#text_area1 .Emoteimg {
	margin: 0;
}

.submitbtn {
	display: block;
	text-align: right;
	margin-right: 25px;
	/* display: block;
	position: absolute;
	width: 100%;
	bottom: 10px;
	right: 30px;
	text-align: right; */

}

.submitbtn button {
	width: 86px;
	border: 0;
	border-radius: 5px;
	padding: 4px 28px;
	box-sizing: border-box;
	color: #1D6D87;
	background-color: #f2f2f2;
}

/* 弹框 */
.alert {
	display: none;
	position: fixed;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 99999;
	padding: 15px;
	border: 1px solid transparent;
	border-radius: 4px;
	text-align: center;
	color: #fff;
	background: #000;
	background: rgba(0, 0, 0, 0.7);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f000000, endColorstr=#7f000000);
	zoom: 1;
}

.alert img {
	width: 70%;
	margin: auto;
	max-width: 600px;
	cursor: zoom-in;

}

/* 关闭按钮 */
.close-btn1 {
	position: absolute;
	top: 7px;
	right: 13px;
	padding: 3px 10px;
	background: #000;
	border-radius: 5px;
	cursor: pointer;
	font-size: 20px;
}

/* 弹框 */
.alert {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	min-width: 200px;
	margin-left: unset;
	z-index: 999999999999;
	padding: 15px;
	border: 1px solid transparent;
	border-radius: 4px;
	background: #000;
	background: rgba(0, 0, 0, 0.6);
}

/* @media  (max-width:560px) {
	.user_box .triangle{}
} */
@media only screen and (max-width: 1030px) {
	.alert img {
		width: 80%;
	}

}

@media only screen and (max-width: 800px) {
	.alert img {
		width: 100%;
	}

}

@media only screen and (max-width: 430px) {
	.exchange_area {
		display: inline-block;
	}

	.business {
		width: auto;
	}

}

/*pingjia*/
.evaluation-form * {
	font-family: "雅黑", "宋体", arial, verdana, sans-serif;
	font-size: 14px;
	color: #666;
	box-sizing: border-box;
	/* width: 540px;
            height: 450px; */
}

.evaluation-form label {
	display: flex;
	align-items: center;
	margin-bottom: 10px;
}

.evaluation-form textarea {
	color: white;
	border: 1px solid #666;
	padding: 10px 10px;
	border-radius: 5px;
	min-width: 269px;
	height: 90px;
	resize: none;
}

.submit-btn {
	background-color: #349ee2;
	color: white;
	border: none;
	padding: 10px 20px;
	cursor: pointer;
	border-radius: 5px;
	min-width: 270px;
	text-align: center;
}

.stars {
	display: flex;
	margin-left: 20px;
}

.star {
	cursor: pointer;
	margin-right: 8px;
	display: flex;
	align-items: center;
}

.star img {
	margin-right: 5px;
	width: 23px;
	height: 23px;
}

.evaluation-form .top {
	color: #666 !important;
	margin-bottom: 5px;
}